<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <input type="text">
    <ul></ul>

</body>

</html>
<script src="./promise.js"></script>

<script>
    let oUl = document.querySelector('ul')
    //一 获取input绑定值改变事件
    document.querySelector('input').oninput = function () {
        //二 事件处理函数中  核心思想请求接口
        //1 细节 获取参数  请求接口
        get(
            "https://www.baidu.com/sugrec",
            {
                prod: 'pc',
                wd: this.value
            },
            'json'
        )
            .then(res => {

                // console.log(res);
                //三 拿到数据之后 核心思想页面显示
                //1 细节  清空 遍里 造li 防内容 追加
                // document.querySelector('ul').innerText = ""
                // console.log(document.querySelector('ul').innerText );
                // console.log(res.g)
                oUl.innerText = ""
                console.log( oUl.innerText);
                console.log(res);
                if (!res.g) return
                res.g.forEach((item, i) => {
                    // item 是数组中一个一个对象{type: 'sug', sa: 's_1', q: 'html是一种什么文件}
                    //i 索引
                    //造li并且防内容 追加到页面
                    let li = document.createElement('li')
                    li.innerText = item.q
                    oUl.appendChild(li)
                })

            })
            .catch(err => {
                console.log(err);
            })
            .finally(() => {
                console.log('11');
            })
    }


</script>